<template>
  <el-upload
    drag
    :action="uploadImageAction"
    multiple
    :headers="{
      token:token
    }"
    name="img"
    :data="data"
    :on-success="uploadSuccess"
    :on-error="uploadError"
  >
    <el-icon class="el-icon--upload"><upload-filled /></el-icon>
    <div class="el-upload__text">
      Drop file here or <em>click to upload</em>
    </div>
    <template #tip>
      <div class="el-upload__tip">
        jpg/png files with a size less than 500kb
      </div>
    </template>
  </el-upload>
</template>
  
<script lang='ts' setup>
import { uploadImageAction } from '@/services/image_class'
import { getToken } from '@/composables/auth'; 

const token = getToken()
console.log(token)

defineProps({
  data: Object
})

const emit = defineEmits(['success'])

// 上传成功
const uploadSuccess = (response: any, uploadFile: any, uploadFiles: any) => {
  console.log(response)
  emit('success',{
    response, uploadFile, uploadFiles
  })
}
// 上传失败
const uploadError = (error: Error, uploadFile: any, uploadFiles: any) => {
  console.log(error)
}

</script>
  
<style scoped lang='less'>
  
</style>
